<template>
	<view class="collapse-tree">
		<collapse-tree-item v-bind="$attrs" :list="treeList" />
	</view>
</template>

<script setup>
import { computed } from 'vue'
import collapseTreeItem from './collapse-tree-item'

const props = defineProps({
	list: {
		type: Array,
		default: () => []
	}
})
const treeList = computed(() => {
	const data = renderTreeList(props.list)
	return data
})
const renderTreeList = (list, rank = 1) => {
	const data = list.map(item => {
		item.rank = rank
		if (Array.isArray(item.children) && item.children.length > 0) {
			item.isOpen = true
			renderTreeList(item.children, rank + 1)
		}
		return item
	})
	return data
}
</script>

<style lang="scss"></style>
